<div class="row">
  <div class="col-xs-12">
    <div class="box">
      <div class="box-header">
      </div>
      <!-- /.box-header -->
      <div class="box-body">
        <div class="dataTables_wrapper form-inline dt-bootstrap">
          <div class="row">
            <div class="col-sm-6">
              <!--<button class="btn btn-success btn-flat" (click)="add()">新增</button>-->
            </div>
            <div class="col-sm-6">
            </div>
          </div>
          <div class="row">
            <div class="col-sm-12">
              <table id="" class="table table-bordered table-hover dataTable" role="grid"
                     aria-describedby="example2_info">
                <thead>
                <tr>
                  <th>#</th>
                  <th>书名</th>
                  <th>作者</th>
                  <th>分类</th>
                  <th>ISBN</th>
                  <th width="30%">简介</th>
                  <th>上传人</th>
                  <th>状态</th>
                  <th width="150">操作</th>
                </tr>
                </thead>
                <tbody>
                <tr role="row" *ngFor="let item of bookList; index as i">
                  <td><b>{{i+1}}</b></td>
                  <td>{{item.bookname}}</td>
                  <td>{{item.author}}</td>
                  <td>
                    {{types[item.typeId]}}
                  </td>
                  <td>{{item.isbn}}</td>
                  <td>
                    <div class="ellipsis">{{item.remark}}</div>
                  </td>
                  <td>{{item.submitUserName || '未知'}}</td>
                  <td>
                    <div [ngSwitch]="item.state">
                      <b class="text-primary" *ngSwitchCase="'checkIn'">已通过</b>
                      <b class="text-default" *ngSwitchCase="'fail'">不通过</b>
                      <b class="text-warning" *ngSwitchDefault>未审核</b>
                    </div>
                  </td>
                  <td>
                    <button class="btn btn-danger btn-sm" *ngIf="item.state==='checkIn'" (click)="setState(item,'fail')">下架</button>
                    <button class="btn btn-primary btn-sm" *ngIf="item.state==='fail'" (click)="setState(item,'checkIn')">上架</button>
                    <button class="btn btn-default btn-sm" (click)="edit(item.id)">编辑</button>
                  </td>
                </tr>
                </tbody>
              </table>
            </div>
          </div>
          <div class="row">
            <div class="col-sm-12 text-right">
              <ul class="pagination">
                <li class="paginate_button previous" [ngClass]="{'disabled':pager.first}"><a href="javascript:" (click)="pre()">上一页</a></li>
                <li class="paginate_button " [ngClass]="{'active':pager.number === i}" *ngFor="let i of pager.items"><a href="javascript:" (click)="goTo(i)">{{i+1}}</a></li>
                <li class="paginate_button next" [ngClass]="{'disabled':pager.last}"><a href="javascript:" (click)="next()">下一页</a></li>
              </ul>
            </div>
          </div>
        </div>
      </div>
      <!-- /.box-body -->
    </div>
  </div>
</div>
